import React from 'react';
import * as echarts from 'echarts';
import moment from 'moment';
class EchartBarY extends React.Component {
  myChart = {};
  componentDidMount() {
    this.myChart = echarts.init(document.getElementById('EchartBarY'));
    let _this = this;
    setInterval(function () {
      _this.myChart.resize();
    }, 2000);
  }
  componentDidUpdate() {
    const { data } = this.props;

    var option = {
      title: {
        text: '巡查统计',
      },
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'shadow',
        },
      },
      legend: {},
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true,
      },
      xAxis: {
        type: 'value',
        boundaryGap: [0, 0.01],
      },
      yAxis: {
        type: 'category',
        data: data.x,
      },
      series: [
        {
          name: '巡查时长',
          type: 'bar',
          data: data.y,
        },
        {
          name: '巡查次数',
          type: 'bar',
          data: data.y2,
        },
      ],
    };
    // 绘制图表
    this.myChart.setOption(option);
  }
  render() {
    return <div id="EchartBarY" style={{ height: this.props.height }}></div>;
  }
}
export default EchartBarY;
